// 这个文件用于创建路由表，路由的第二种写法
// 当前项目采取的是这种写法

import {Navigate} from 'react-router-dom'
// 引入路由组件
// import About from '@/views/About'
import Home from '@/views/Home'
import Login from "@/views/Login"
import Page1 from '@/views/Page1'
import Page2 from '@/views/Page2'
import Page301 from '@/views/Page301'
import Page302 from '@/views/Page302'
import Page303 from '@/views/Page303'
import Page402 from '@/views/Page402'
import Page401 from '@/views/Page401'
import Page5 from '@/views/Page5'


const routes =  [
	{
		path:'/',
		element: <Navigate to="/page1" />   // 重定向
	},
	{
		path:'/',
		element:<Home/>,
		/* 
			当路由路径有 / 的时候，显示 Home 路由组件，而上面又设置了当路由路径为 / 的时候，重定向为 /page1，
			根据下面设置的二级路由，显示对应的路由组件 Page1
		*/
		children:[
			{
				path: "/page1",
				element: <Page1/>
			},
			{
				path: "/page2",
				element: <Page2/>
			},
			{
				path:'/page3/page301',
				element: <Page301/>
			},
			{
				path:'/page3/page302',
				element: <Page302/>
			},
			{
				path:'/page3/page303',
				element: <Page303/>
			},
			{
				path:'/page4/page401',
				element: <Page401/>
			},
			{
				path:'/page4/page402',
				element: <Page402/>
			},
			{
				path:'/page5',
				element: <Page5/>
			}
		]
	},
	{
		path:'/login',
		element: <Login/>
	},
	{
		// 当访问其他路由路径的时候，重定向到 /page1，也就是跳转到首页
		path:'*',
		element: <Navigate to="/page1"/>
	}
	
]

export default routes